<div class="tab-title">
	<ul>
		<li id="one1" onmousedown="setContentTab('one',1,2)" class="cur">基本设置</li>
		<li id="one2" onmousedown="setContentTab('one',2,2)">同类替换</li>
	</ul>
</div>

<div class="tab-con" id="con_one_1" style="display:block;">

	<div class="addtextbox">
		<a class="addtext" href="javascript:;">添加列表</a><div class="drag-tip">按住鼠标上下拖动排序</div>
	</div>

	<div class="setfontlink" style="height:290px;">
		<ul id="dragmask">
			<li>
				<div class="f-l editfont"><span>二级菜单：</span><input type="text" name="news_title" id="" value="奔驰M级AMG" class="stext" /></div>
				<div class="f-l editfont">
					<span>链接地址：</span>
					<div class="selectlink">
						<input type="text" name="news_url" id="" value="http://www.17sucai.com/" class="stext" />
						<ul class="sublinkbox">
							<li data-url="/">网站首页</li>
							<li data-url="/about">关于我们</li>
							<li data-url="/contact">联系我们</li>
						</ul>
					</div>
				</div>
				<select class="f-l linkopen" name="news_opentype" id=""><option value="">目前窗口打开</option><option value="_blank">新的窗口打开</option></select>
				<a title="删除" class="canceltext" href="javascript:void(0);">删除</a>
			</li>
			<li>
				<div class="f-l editfont"><span>二级菜单：</span><input type="text" name="news_title" id="" value="奔驰M级AMG" class="stext" /></div>
				<div class="f-l editfont">
					<span>链接地址：</span>
					<div class="selectlink">
						<input type="text" name="news_url" id="" value="http://www.17sucai.com/" class="stext" />
						<ul class="sublinkbox">
							<li data-url="/">网站首页</li>
							<li data-url="/about">关于我们</li>
							<li data-url="/contact">联系我们</li>
						</ul>
					</div>
				</div>
				<select class="f-l linkopen" name="news_opentype" id=""><option value="">目前窗口打开</option><option value="_blank">新的窗口打开</option></select>
				<a title="删除" class="canceltext" href="javascript:void(0);">删除</a>
			</li>
			<li>
				<div class="f-l editfont"><span>二级菜单：</span><input type="text" name="news_title" id="" value="奔驰M级AMG" class="stext" /></div>
				<div class="f-l editfont">
					<span>链接地址：</span>
					<div class="selectlink">
						<input type="text" name="news_url" id="" value="http://www.17sucai.com/" class="stext" />
						<ul class="sublinkbox">
							<li data-url="/">网站首页</li>
							<li data-url="/about">关于我们</li>
							<li data-url="/contact">联系我们</li>
						</ul>
					</div>
				</div>
				<select class="f-l linkopen" name="news_opentype" id=""><option value="">目前窗口打开</option><option value="_blank">新的窗口打开</option></select>
				<a title="删除" class="canceltext" href="javascript:void(0);">删除</a>
			</li>
			<li>
				<div class="f-l editfont"><span>二级菜单：</span><input type="text" name="news_title" id="" value="奔驰M级AMG" class="stext" /></div>
				<div class="f-l editfont">
					<span>链接地址：</span>
					<div class="selectlink">
						<input type="text" name="news_url" id="" value="http://www.17sucai.com/" class="stext" />
						<ul class="sublinkbox">
							<li data-url="/">网站首页</li>
							<li data-url="/about">关于我们</li>
							<li data-url="/contact">联系我们</li>
						</ul>
					</div>
				</div>
				<select class="f-l linkopen" name="news_opentype" id=""><option value="">目前窗口打开</option><option value="_blank">新的窗口打开</option></select>
				<a title="删除" class="canceltext" href="javascript:void(0);">删除</a>
			</li>
		</ul>
		
		<!-- 排序保存在这里可以检索服务器上的回传 -->
		<input name="list1SortOrder" type="hidden" />
		
	</div>
	
	<div class="subbtn">
		<a class="btn-ok" href="javascript:void(0);">保存</a>
		<a class="btn-cancel" href="javascript:;" onclick="closeDialog()">取消</a>
	</div>

</div>

<div class="tab-con" id="con_one_2" style="display:none;">
	<div class="modulebox">
		<ul>
			<li>
				<div class="p-pic"><img src="images/wqe2354.jpg" width="100" /></div>
				<div class="p-text">
					<h3>某某模板的 — <strong>banner</strong></h3>
					<div class="p-btn">
						<a class="graybtn">已经应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>
					</div>
				</div>
			</li>
			<li>
				<div class="p-pic"><img src="images/wqe2354.jpg" width="100" /></div>
				<div class="p-text">
					<h3>某某模板的 — <strong>banner</strong></h3>
					<div class="p-btn">
						<a class="bluebtn" href="#">添加应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>
					</div>
				</div>
			</li>
			<li>
				<div class="p-pic"><img src="images/wqe2354.jpg" width="100" /></div>
				<div class="p-text">
					<h3>某某模板的 — <strong>banner</strong></h3>
					<div class="p-btn">
						<a class="bluebtn" href="#">添加应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>
					</div>
				</div>
			</li>
			<li>
				<div class="p-pic"><img src="images/wqe2354.jpg" width="100" /></div>
				<div class="p-text">
					<h3>某某模板的 — <strong>banner</strong></h3>
					<div class="p-btn">
						<a class="bluebtn" href="#">添加应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>
					</div>
				</div>
			</li>
			<li>
				<div class="p-pic"><img src="images/wqe2354.jpg" width="100" /></div>
				<div class="p-text">
					<h3>某某模板的 — <strong>banner</strong></h3>
					<div class="p-btn">
						<a class="bluebtn" href="#">添加应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>
					</div>
				</div>
			</li>
			<li>
				<div class="p-pic"><img src="images/wqe2354.jpg" width="100" /></div>
				<div class="p-text">
					<h3>某某模板的 — <strong>banner</strong></h3>
					<div class="p-btn">
						<a class="bluebtn" href="#">添加应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>
					</div>
				</div>
			</li>
		</ul>
		
		<div class="clear"></div>
		<div class="pagination_div"></div>
	</div>
</div>



<script type="text/javascript">
$('#con_one_1').ready(function(){

	$(this).initNewsEdit();

	/* 拖动排序效果 */
	$("#dragmask").dragsort({
		dragSelector: ".editfont",
		dragBetween: true, 
		dragEnd: saveOrder, 
		placeHolderTemplate: "<li class='placeHolder'><div></div></li>",
		scrollSpeed: 5
	});
	
	function saveOrder() {
		var data = $("#dragmask li").map(function(){
			return
			$(this).children().html();
		}).get();
		$("input[name=list1SortOrder]").val(data.join("|"));
	};
	
});
</script>


<script type="text/javascript">
MyPagination.init({
	renderer: '#con_one_2 .pagination_div',
	ajaxOpts: {
		url: 'ajax/banner.json',
		type: 'get',
		dataType: 'json',
		params: {}
	},
	handleOpts: {
		// 数据获取之后的操作
		formatValues: function(data) {
			var listEls = $('#con_one_2 .modulebox > ul');
			listEls.empty(); // 清空
			$.each(data, function(index, value) {
				var innerHmtl = 
					'<li>'+
						'<div class="p-pic"><img src="' + value.pic + '" width="100" /></div>'+
						'<div class="p-text">'+
							'<h3>' + value.ower + ' — <strong>banner</strong></h3>'+
							'<div class="p-btn">'+
								'<a class="bluebtn" href="#">添加应用</a><a target="_blank" class="btn-ok" href="#">查看效果</a>'+
							'</div>'+
						'</div>'+
					'</li>';
				listEls.append(innerHmtl);
			});
		}
	},
	pageOpts: {
		num_edge_entries: 3, // 前后显示的个数
		num_display_entries: 3, // 显示数
		items_per_page: 2 // 每页显示多少条
	}
});
</script>